<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="../static/css/sen/showcomment.css" />
<link rel="stylesheet" type="text/css"
	href="../static/bootstrap-3.3.7/dist/css/bootstrap-theme.min.css" />
<link rel="stylesheet" type="text/css"
	href="../static/bootstrap-3.3.7/dist/css/bootstrap.min.css" />
<!-- <script src="../static/css/bootstrap-3.3.7/dist/js/bootstrap.js"
	type="text/javascript" charset="utf-8"></script> -->
<script src="../static/js/jquery-1.12.4.min.js"
	type="text/javascript" charset="utf-8"></script>

<script type="text/javascript">
	function dojquery() {
		// 使用jquery进行ajax请求处理
		$(".comment-area").css("display","block");
		$.ajax({
			type : "GET",
			url : '../QueryComment',
			data : $("#reviewcontent").serialize(),
			dataType : "json",
			success : function(data) {
				// 将请求的数据放输出到div里面
				console.info(data);
				var strHtml = "";
				$.each(data, function(index, eachVal) {
					var userID = eachVal.userid;
					var showID = phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
					strHtml += "<div id='userid' style='float:left;text-align:center'>";
					strHtml += showID;
					strHtml += "</div>";
					
					strHtml +="<div id='viewcontent'>";
					
					strHtml += "<div id='userreview'>";
					strHtml += eachVal.userreview;
					strHtml += "</div>";

					

					strHtml += "<div id='servicereview'>";
					strHtml += "<div>";
					strHtml += "客服：";
					strHtml += "</div>";
					strHtml += "&nbsp;&nbsp;&nbsp;&nbsp;"+eachVal.servicereview;
					strHtml += "</div>";
					
					strHtml += "</div>";

				});

				// 把解析的html内容，使用dom操作赋值到表格中
				$("#reviewcontent").html(strHtml);
			},
			error : function(data) {
				alert("请求失败" + data);
			}

		});
	}
</script>

</head>
<body>
	<!--点击商品评价出现 ajax实现-->
	<a href="#" onclick="dojquery()">商品评价</a>
	<div class="comment-area" style="width:100px;height:900px;display:none">
		<div class="filter-lsit">
			<ul class="comment-filter-list">
				<li><input type="radio" name="filter-radio" checked="checked"
					value="radio1" />全部评价</li>
				<li><input type="radio" name="filter-radio" value="radio2" />追评
				</li>
				<li><input type="radio" name="filter-radio" value="radio3" />有图的评价</li>
			</ul>
		</div>
		<div id="reviewcontent1">
			<div id="userid" style="">183*******134</div>
			<div id="viewcontent">
				<div id="userreview" style="height: 99px;">很好~~用起来很舒服！！！</div>
				<div id="servicereview">
					<div id="serviceid">客服：</div>&nbsp;&nbsp;&nbsp;&nbsp;谢谢支持~！！</div>
			</div>
		</div>
		<div id="reviewcontent"></div>
	</div>
</body>
</html>